<template>
  <div>
    <div class="record-title">熏蒸治疗单</div>
    <el-form :model="formData" ref="vForm" :rules="rules" label-position="left" label-width="80px" size="medium"
      @submit.native.prevent>
      <div class="table-container">
        <table class="table-layout center" style="margin-bottom: 40px;">
          <tbody>
            <tr>
              <td class="table-cell" colspan="2">姓名:
              </td>
              <td class="table-cell" colspan="5">电话：
              </td>
            </tr>
            <tr>
              <td class="table-cell">治疗时间
              </td>
              <td class="table-cell" colspan="6">开始时间： 结束时间：
              </td>
            </tr>
            <tr>
              <td class="table-cell" rowspan="21">治疗记录
              </td>
              <td class="table-cell">次数
              </td>
              <td class="table-cell">日期
              </td>
              <td class="table-cell" colspan="3">治疗方案
              </td>
              <td class="table-cell">确认签字
              </td>
            </tr>
            <tr>
              <td class="table-cell">1
              </td>
              <td class="table-cell">
              </td>
              <td class="table-cell" colspan="3">
              </td>
              <td class="table-cell">
              </td>
            </tr>
            <tr>
              <td class="table-cell">2
              </td>
              <td class="table-cell">
              </td>
              <td class="table-cell" colspan="3">
              </td>
              <td class="table-cell">
              </td>
            </tr>
            <tr>
              <td class="table-cell">3
              </td>
              <td class="table-cell">
              </td>
              <td class="table-cell" colspan="3">
              </td>
              <td class="table-cell">
              </td>
            </tr>
            <tr>
              <td class="table-cell">4
              </td>
              <td class="table-cell">
              </td>
              <td class="table-cell" colspan="3">
              </td>
              <td class="table-cell">
              </td>
            </tr>
            <tr>
              <td class="table-cell">5
              </td>
              <td class="table-cell">
              </td>
              <td class="table-cell" colspan="3">
              </td>
              <td class="table-cell">
              </td>
            </tr>
            <tr>
              <td class="table-cell">6
              </td>
              <td class="table-cell">
              </td>
              <td class="table-cell" colspan="3">
              </td>
              <td class="table-cell">
              </td>
            </tr>
            <tr>
              <td class="table-cell">7
              </td>
              <td class="table-cell">
              </td>
              <td class="table-cell" colspan="3">
              </td>
              <td class="table-cell">
              </td>
            </tr>
            <tr>
              <td class="table-cell">8
              </td>
              <td class="table-cell">
              </td>
              <td class="table-cell" colspan="3">
              </td>
              <td class="table-cell">
              </td>
            </tr>
            <tr>
              <td class="table-cell">9
              </td>
              <td class="table-cell">
              </td>
              <td class="table-cell" colspan="3">
              </td>
              <td class="table-cell">
              </td>
            </tr>
            <tr>
              <td class="table-cell">10
              </td>
              <td class="table-cell">
              </td>
              <td class="table-cell" colspan="3">
              </td>
              <td class="table-cell">
              </td>
            </tr>
            <tr>
              <td class="table-cell">11
              </td>
              <td class="table-cell">
              </td>
              <td class="table-cell" colspan="3">
              </td>
              <td class="table-cell">
              </td>
            </tr>
            <tr>
              <td class="table-cell">12
              </td>
              <td class="table-cell">
              </td>
              <td class="table-cell" colspan="3">
              </td>
              <td class="table-cell">
              </td>
            </tr>
            <tr>
              <td class="table-cell">13
              </td>
              <td class="table-cell">
              </td>
              <td class="table-cell" colspan="3">
              </td>
              <td class="table-cell">
              </td>
            </tr>
            <tr>
              <td class="table-cell">14
              </td>
              <td class="table-cell">
              </td>
              <td class="table-cell" colspan="3">
              </td>
              <td class="table-cell">
              </td>
            </tr>
            <tr>
              <td class="table-cell">15
              </td>
              <td class="table-cell">
              </td>
              <td class="table-cell" colspan="3">
              </td>
              <td class="table-cell">
              </td>
            </tr>
            <tr>
              <td class="table-cell">16
              </td>
              <td class="table-cell">
              </td>
              <td class="table-cell" colspan="3">
              </td>
              <td class="table-cell">
              </td>
            </tr>
            <tr>
              <td class="table-cell">17
              </td>
              <td class="table-cell">
              </td>
              <td class="table-cell" colspan="3">
              </td>
              <td class="table-cell">
              </td>
            </tr>
            <tr>
              <td class="table-cell">18
              </td>
              <td class="table-cell">
              </td>
              <td class="table-cell" colspan="3">
              </td>
              <td class="table-cell">
              </td>
            </tr>
            <tr>
              <td class="table-cell">19
              </td>
              <td class="table-cell">
              </td>
              <td class="table-cell" colspan="3">
              </td>
              <td class="table-cell">
              </td>
            </tr>
            <tr>
              <td class="table-cell">20
              </td>
              <td class="table-cell">
              </td>
              <td class="table-cell" colspan="3">
              </td>
              <td class="table-cell">
              </td>
            </tr>
          </tbody>
        </table>
      </div>
    </el-form>
  </div>
</template>
<script>
export default {
  name: '',
  data() {
    return {
    }
  },
  methods: {
  },
}
</script>
<style lang="scss" scoped>
.center {
  width: 80%;
  margin: 0 auto;
}

.record-title {
  font-size: 27px;
  font-weight: bold;
  text-align: center;
  margin: 20px 0;
}

.patient-info {
  text-align: center;
  margin-top: 20px;
}

.info-row {
  display: inline-block;
  padding-bottom: 15px;
}

.info-item {
  display: inline-block;
  margin: 0 20px;
  font-size: 16px;
  color: #333;
}

div.table-container {
  table.table-layout {
    table-layout: fixed;
    border-collapse: collapse;
    text-align: center;

    td.table-cell {
      display: table-cell;
      height: 38px;
      border: 1px solid #333;
      font-size: 16px;
      overflow-wrap: break-word;
    }
  }
}
</style>
